import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _applyDecoratedDescriptor from "@babel/runtime/helpers/esm/applyDecoratedDescriptor";
import _filter from "lodash/filter";
import _omit from "lodash/omit";
import _map from "lodash/map";

var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _class;

/**
 * PageScriptModal.js
 * @date 2018/11/6
 */
import React from 'react';
import { Modal, Input, Button } from 'antd';
import { Bind } from 'lodash-decorators';
import { getEditTableData } from 'utils/utils';
import EditTable from 'components/EditTable';
import ScriptEdit from "./index";
import styles from "../../index.less?modules";
var omitProps = ['dataSource'];
var modalBodyStyle = {
  height: 400,
  overflow: 'auto'
};
var tableScroll = {
  y: 340
};
var PageScriptModal = (_dec = Bind(), _dec2 = Bind(), _dec3 = Bind(), _dec4 = Bind(), _dec5 = Bind(), _dec6 = Bind(), (_class = /*#__PURE__*/function (_React$Component) {
  _inherits(PageScriptModal, _React$Component);

  var _super = _createSuper(PageScriptModal);

  function PageScriptModal() {
    var _this;

    _classCallCheck(this, PageScriptModal);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));
    _this.state = {
      diffState: {}
    };
    _this.columns = [{
      title: '编码',
      dataIndex: 'name',
      width: 120,
      render: function render(item, record) {
        var _status = record._status,
            $form = record.$form;

        switch (_status) {
          case 'create':
            return $form.getFieldDecorator('name', {
              initialValue: item,
              rules: [{
                required: true,
                message: '编码不能为空'
              }]
            })( /*#__PURE__*/React.createElement(Input, null));

          case 'update':
          default:
            return item;
        }
      }
    }, {
      title: '描述',
      dataIndex: 'description',
      width: 200,
      render: function render(item, record) {
        var _status = record._status,
            $form = record.$form;

        switch (_status) {
          case 'create':
          case 'update':
            return $form.getFieldDecorator('description', {
              initialValue: item,
              rules: [{
                required: true,
                message: '描述不能为空'
              }]
            })( /*#__PURE__*/React.createElement(Input, null));

          default:
            return item;
        }
      }
    }, {
      title: '操作',
      key: 'content',
      width: 80,
      render: function render(item, record) {
        var _status = record._status;

        switch (_status) {
          case 'create':
          case 'update':
            return /*#__PURE__*/React.createElement("span", {
              className: styles['table-row-operator']
            }, /*#__PURE__*/React.createElement("a", {
              onClick: _this.handleScriptEdit.bind(_assertThisInitialized(_this), record)
            }, "\u7F16\u8F91"), /*#__PURE__*/React.createElement("a", {
              onClick: _this.handleScriptRemove.bind(_assertThisInitialized(_this), record)
            }, "\u5220\u9664"));

          default:
            return /*#__PURE__*/React.createElement("span", {
              className: styles['table-row-operator']
            }, /*#__PURE__*/React.createElement("a", {
              className: styles['tag-a-disabled']
            }, "\u7F16\u8F91"), /*#__PURE__*/React.createElement("a", null, "\u5220\u9664"));
        }
      }
    }];
    return _this;
  }

  _createClass(PageScriptModal, [{
    key: "render",
    value: function render() {
      var otherProps = _omit(this.props, omitProps);

      var _this$state = this.state,
          dataSource = _this$state.dataSource,
          scriptEditProps = _this$state.scriptEditProps,
          editRecord = _this$state.editRecord;
      return /*#__PURE__*/React.createElement(Modal, Object.assign({}, otherProps, {
        title: "\u9875\u9762\u65B9\u6CD5",
        onOk: this.handleSave,
        afterClose: this.handleCleanState,
        width: 1000,
        bodyStyle: modalBodyStyle
      }), /*#__PURE__*/React.createElement("div", {
        className: styles['page-func-modal']
      }, /*#__PURE__*/React.createElement("div", {
        className: styles['page-func-modal-table']
      }, /*#__PURE__*/React.createElement("div", {
        className: styles['page-func-modal-table-operator']
      }, /*#__PURE__*/React.createElement(Button, {
        icon: "plus",
        onClick: this.handleScriptAdd
      })), /*#__PURE__*/React.createElement(EditTable, {
        bordered: true,
        columns: this.columns,
        dataSource: dataSource,
        rowKey: this.orderRowKey,
        pagination: false,
        rowClassName: this.getRowClassName,
        scroll: tableScroll
      })), /*#__PURE__*/React.createElement("div", {
        className: styles['page-func-modal-script-modal']
      }, editRecord && /*#__PURE__*/React.createElement(ScriptEdit, Object.assign({}, scriptEditProps, {
        onChange: this.handleScriptChange
      })))));
    }
  }, {
    key: "handleSave",
    value: function handleSave() {
      var onOk = this.props.onOk;
      var _this$state$dataSourc = this.state.dataSource,
          dataSource = _this$state$dataSourc === void 0 ? [] : _this$state$dataSourc;
      var dLen = dataSource.length; // 所有 script 的数量

      var saveDataSource = getEditTableData(dataSource, []);

      if (saveDataSource.length !== dLen) {
        // 校验出现问题
        return;
      }

      onOk(saveDataSource);
    }
    /**
     * 在 Modal 关闭后 清理 state 数据
     */

  }, {
    key: "handleCleanState",
    value: function handleCleanState() {
      this.setState({
        editRecord: null,
        scriptEditProps: {}
      });
    }
  }, {
    key: "orderRowKey",
    value: function orderRowKey(record, index) {
      return index + 1;
    }
  }, {
    key: "handleScriptAdd",
    value: function handleScriptAdd() {
      var newRecord = {
        _status: 'create',
        name: 'create',
        description: '',
        content: 'function create() {\n}'
      };
      var _this$state$dataSourc2 = this.state.dataSource,
          dataSource = _this$state$dataSourc2 === void 0 ? [] : _this$state$dataSourc2;
      this.setState({
        dataSource: [].concat(_toConsumableArray(dataSource), [newRecord]),
        editRecord: newRecord,
        scriptEditProps: {
          value: newRecord.content
        }
      });
    }
  }, {
    key: "handleScriptEdit",
    value: function handleScriptEdit(record, e) {
      if (e && e.preventDefault) {
        e.preventDefault();
      }

      var editRecord = this.state.editRecord;

      if (editRecord === record) {
        return;
      }

      var _record$content = record.content,
          content = _record$content === void 0 ? '' : _record$content;
      this.setState({
        editRecord: record,
        scriptEditProps: {
          value: content
        }
      });
    }
  }, {
    key: "handleScriptRemove",
    value: function handleScriptRemove(record, e) {
      if (e && e.preventDefault) {
        e.preventDefault();
      }

      var _this$state2 = this.state,
          editRecord = _this$state2.editRecord,
          dataSource = _this$state2.dataSource;
      var nextState = {};

      if (editRecord === record) {
        nextState.editRecord = null;
        nextState.scriptEditProps = {};
      }

      nextState.dataSource = _filter(dataSource, function (r) {
        return r !== record;
      });
      this.setState(nextState);
    }
  }, {
    key: "handleScriptChange",
    value: function handleScriptChange(value) {
      var _this$state3 = this.state,
          scriptEditProps = _this$state3.scriptEditProps,
          editRecord = _this$state3.editRecord;
      editRecord.content = value;
      this.setState({
        scriptEditProps: _objectSpread(_objectSpread({}, scriptEditProps), {}, {
          value: value
        })
      });
    }
  }, {
    key: "getRowClassName",
    value: function getRowClassName(record) {
      var editRecord = this.state.editRecord;

      if (record === editRecord) {
        return styles['active-table-row'];
      }

      return '';
    }
  }], [{
    key: "getDerivedStateFromProps",
    value: function getDerivedStateFromProps(nextProps, prevState) {
      var diffDataSource = prevState.diffState.dataSource;
      var dataSource = nextProps.dataSource;

      if (diffDataSource !== dataSource) {
        return {
          dataSource: _map(dataSource, function (r) {
            return _objectSpread(_objectSpread({}, r), {}, {
              _status: 'update'
            });
          }),
          // 已经把所有数据都clone了一份(没有引用数据)
          diffState: {
            dataSource: dataSource
          }
        };
      }

      return null;
    }
  }]);

  return PageScriptModal;
}(React.Component), (_applyDecoratedDescriptor(_class.prototype, "handleSave", [_dec], Object.getOwnPropertyDescriptor(_class.prototype, "handleSave"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "handleCleanState", [_dec2], Object.getOwnPropertyDescriptor(_class.prototype, "handleCleanState"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "orderRowKey", [_dec3], Object.getOwnPropertyDescriptor(_class.prototype, "orderRowKey"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "handleScriptAdd", [_dec4], Object.getOwnPropertyDescriptor(_class.prototype, "handleScriptAdd"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "handleScriptChange", [_dec5], Object.getOwnPropertyDescriptor(_class.prototype, "handleScriptChange"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "getRowClassName", [_dec6], Object.getOwnPropertyDescriptor(_class.prototype, "getRowClassName"), _class.prototype)), _class));
export { PageScriptModal as default };